﻿@using PlainChat.Models
@model IList<SnapModel>
@{
    ViewBag.Title = "Home Page";
}
@section featured {

    <header class="jumbotron subhead" style="background: linear-gradient(to top right, #A6FF21 0%, #7CEFC1 100%); box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.2) inset, 0px -3px 7px rgba(0, 0, 0, 0.2) inset; color: rgb(255, 255, 255); padding: 25px 0px; position: relative; text-align: center; text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.4), 0px 0px 30px rgba(0, 0, 0, 0.075);">
        <section id="fluidGridSystem">
            <div class="bs-docs-grid">
                <div class="row-fluid show-grid">
                    <div class="span4">
                        <h3>Popular today</h3>
                        @foreach (var item in @Model)
                        {
                            @Html.Partial("_SnapModule", item)
                            
                        }
                    </div>
                    <div class="span4">
                        <h3>Near you</h3>
                        <div class="media">
                            <a class="pull-left" href="#">
                                <img class="media-object" src="http://media.tumblr.com/tumblr_md79xsDLzO1qdeu0k.jpg">
                            </a>
                            <div class="media-body">
                                <div class="contentContainer">
                                    <div class="titleBackground">
                                        <h4 class="media-heading">Justin Bieber, 17<span class="badge badge-success" style="float: right">2.3m</span></h4>
                                    </div>
                                    <div class="statusLine">Hi it's Justin. Snap me and I might just snap you back!</div>
                                </div>
                            </div>
                        </div>
                        <div class="media">
                            <a class="pull-left" href="#">
                                <img class="media-object" src="https://si0.twimg.com/profile_images/2695018807/12537485196f80091730082e3fc0e619.jpeg">
                            </a>
                            <div class="media-body">
                                <div class="contentContainer">
                                    <div class="titleBackground">
                                        <h4 class="media-heading">David Sittingtown, 49<span class="badge badge-success" style="float: right">1.8k</span></h4>
                                    </div>
                                    <div class="statusLine">Hi this is an example description. I could put anything here...E.g. a status.</div>
                                </div>
                            </div>
                        </div>
                        <div class="media">
                            <a class="pull-left" href="#">
                                <img class="media-object" src="http://a0.twimg.com/profile_images/2779782919/941c71d945777d062442b2d255169d1c.jpeg">
                            </a>
                            <div class="media-body">
                                <div class="contentContainer">
                                    <div class="titleBackground">
                                        <h4 class="media-heading">James Key, 27<span class="badge badge-success" style="float: right">1.8k</span></h4>
                                    </div>
                                    <div class="statusLine">Hi this is an example description. I could put anything here...E.g. a status.</div>
                                </div>
                            </div>
                        </div>
                        <a href="#">More...</a>
                    </div>
                    <div class="span4">
                        <h3>Global</h3>
                        <div class="media">
                            <a class="pull-left" href="#">
                                <img class="media-object" src="http://media.4music.com/media/thumb/7405/64x64_50_35.jpg">
                            </a>
                            <div class="media-body">
                                <div class="contentContainer">
                                    <div class="titleBackground">
                                        <h4 class="media-heading">Selina Blackdown, 21<span class="badge badge-success" style="float: right">24m</span></h4>
                                    </div>
                                    <div class="statusLine">Blah blah blahblah blah blah blahblahblah blah blah.</div>
                                </div>
                            </div>
                        </div>
                        <div class="media">
                            <a class="pull-left" href="#">
                                <img class="media-object" src="https://si0.twimg.com/profile_images/2695018807/12537485196f80091730082e3fc0e619.jpeg">
                            </a>
                            <div class="media-body">
                                <div class="contentContainer">
                                    <div class="titleBackground">
                                        <h4 class="media-heading">David Sittingtown, 49<span class="badge badge-success" style="float: right">1.8k</span></h4>
                                    </div>
                                    <div class="statusLine">Hi this is an example description. I could put anything here...E.g. a status.</div>
                                </div>
                            </div>
                        </div>
                        <div class="media">
                            <a class="pull-left" href="#">
                                <img class="media-object" src="http://a0.twimg.com/profile_images/2779782919/941c71d945777d062442b2d255169d1c.jpeg">
                            </a>
                            <div class="media-body">
                                <div class="contentContainer">
                                    <div class="titleBackground">
                                        <h4 class="media-heading">James Key, 27<span class="badge badge-success" style="float: right">1.8k</span></h4>
                                    </div>
                                    <div class="statusLine">Hi this is an example description. I could put anything here...E.g. a status.</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </header>
}
<h3>We suggest the following:</h3>
<ol class="round">
    <li class="one">
        <h5>Getting Started</h5>
        ASP.NET MVC gives you a powerful, patterns-based way to build dynamic websites that
        enables a clean separation of concerns and that gives you full control over markup
        for enjoyable, agile development. ASP.NET MVC includes many features that enable
        fast, TDD-friendly development for creating sophisticated applications that use
        the latest web standards.
        <a href="http://go.microsoft.com/fwlink/?LinkId=245151">Learn more…</a>
    </li>

    <li class="two">
        <h5>Add NuGet packages and jump-start your coding</h5>
        NuGet makes it easy to install and update free libraries and tools.
        <a href="http://go.microsoft.com/fwlink/?LinkId=245153">Learn more…</a>
    </li>

    <li class="three">
        <h5>Find Web Hosting</h5>
        You can easily find a web hosting company that offers the right mix of features
        and price for your applications.
        <a href="http://go.microsoft.com/fwlink/?LinkId=245157">Learn more…</a>
    </li>
</ol>

@section Right{
    <h4>What is this?</h4>
    <p>The next best thing.</p>
}